<template>
<!-- 加入我们 -->
  <div class="produc">
    <div class="produc-banner"></div>
     <div class="container flex-between m40">
      <div class="navigation">
         <div class="navigation-heard">更新日志</div>
        <el-skeleton :rows="30" animated  v-if=" productServiceListEngine.length<=0" />
        <ul >
          <li v-for="(item, i) in productServiceListEngine.child" :key="i"   @click="change(i)" :class="geeindex==i?'atv':''">
            <span>{{ item.name }}</span>
          </li>
        </ul>
      </div>
      <div class="voyage">
          <el-skeleton :rows="30" animated  v-if=" productServiceListEngine.length<=0" />
         <div class="voyage-header flex-between-center" v-for="(item, i) in productServiceListEngine.child" :key="i">
            <span v-if="geeindex == i">{{ item.name  }}</span>
        </div>
        <div class="voyage-box">
          <div   v-for="(item, i) in productServiceListEngine.child" :key="i"  v-if="geeindex == i"   >
            <div class="join-c" v-html="item.details"></div>
            <div class="dow-but">
                <a :href="item.downLocal" target="_block">蓝奏下载</a>
                <a :href="item.downLzy" target="_block">本地下载</a>
              </div>
          </div>
          
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import api from "../api/index";
export default {
  name: "download",
  data() {
    return {
       geeindex: 0,
     productServiceListEngine:'',
    };
  },

  mounted() {
    api.index().then(res => {
      this.productServiceListEngine = res.data.data.productServiceList[0]
    });

  },
  methods: {
    change(i){
      this.geeindex = i
    }
  },
};
</script>

